<template>
	<div>
		<el-card class="box-card">
			<div class="Serach_b">
				<el-input type="input" autosize placeholder="请输入用户ID" v-model="fy.uid" @keyup.enter.native="seachEnter"
					style="width: 300px;margin-left: 20px;">
				</el-input>
				<el-button type="primary" icon="el-icon-search" @click="SearchData()">搜索</el-button>
			</div>
			<el-table :data="CartList" border>
				<el-table-column prop="id" label="id" />
				<el-table-column prop="uid" label="用户ID" />
				<el-table-column prop="productId" label="商品ID" />
				<el-table-column prop="cartNum" label="商品数量" />
				<el-table-column prop="createTime" label="创建时间" />
				<el-table-column prop="updateTime" label="修改时间" />
				<el-table-column label="操作">
					<template slot-scope="scope">
						<el-button type="danger" size="mini" @click="DelClick(scope.row)">删除</el-button>
					</template>
				</el-table-column>
			</el-table>
			<el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange" :page-sizes="[10, 15]"
				:page-size="fy.size" layout="total, sizes, prev, pager, next, jumper" :total="total">
			</el-pagination>
		</el-card>
	</div>
</template>

<script>
	import * as syStoreCartApi from "@/api/Add";
	import * as StoreCartApi from "@/api/Search";
	import {
		timestampToTime
	} from "@/utils/date";
	export default {
		data() {
			return {
				timestampToTime,
				fy: {
					size: 10,
					current: 1,
				},
				total: 0,
				CartList: [],
			};
		},
		methods: {
			DelClick(row) {
				syStoreCartApi.DelStoreCart({
					idList: row.id
				}).then((res) => {
					if (res.data == true) {
						this.dialogVisible = false;
						this.SearchData();
						this.$notify({
							title: "成功",
							message: "删除成功",
							type: "success",
						});
					} else {
						this.dialogVisible = false;
						this.SearchData();
						this.$notify({
							title: "失败",
							message: "删除失败",
							type: "error",
						});
					}
				});
			},
			SearchData() {
				StoreCartApi.InsertStoreCart(this.fy).then((res) => {
					this.total = res.data.total;
					this.CartList = res.data.records;
					this.CartList.forEach((item) => {
						item.createTime = this.timestampToTime(item.createTime);
						item.addTime = this.timestampToTime(item.addTime);
						item.updateTime = this.timestampToTime(item.updateTime);
					});
				});
			},
			handleSizeChange(value) {
				this.fy.size = value;
				this.SearchData();
			},
			handleCurrentChange(value) {
				this.fy.current = value;
				this.SearchData();
			},
		},
		created() {
			this.SearchData();
		},
	};
</script>

<style lang="scss" scoped>
	.el-pagination {
		margin-top: 10px;
	}

	.box-card {
		width: 95%;
		margin: auto;
	}

	.Serach_b {
		display: flex;
		align-items: center;
		margin-bottom: 20px;
	}

	.Serach_b .el-button {
		margin-left: 20px;
	}

	.el-textarea {
		margin-left: 20px;
		width: 20%;
	}
</style>
